// 路由的基本使用
import React from "react"
import ReactDOM from "react-dom"


// 导入组件
import { BrowserRouter as Router, Route, Routes,Link } from "react-router-dom"
// import { HashRouter as Router, Route, Routes,Link } from "react-router-dom"

const First = () => (<p>页面一的内容</p>)

const Home = () => (<h2>home的内容</h2>)

const App = () => (
    <Router>
        <div>
            <h1>react路由基础</h1>

            {/* 指定路由出口 v6版本 */}
            <div>
                <Routes>
                        <Route path="/first" element={<First />}></Route>
                        <Route path="/home" element={<Home />}></Route>
                </Routes>
            </div>

            <Link to="/first">页面一</Link><br />
            <Link to="/home">页面二</Link>

            

            
        </div>      
    </Router>
    
)

ReactDOM.render(<App />, document.getElementById("root"))